<!--用户管理-->
<template>
    <div class="app-container">
        <div class="app-box">
            <div class="user-top">
                <div class="user-row">
                    <div class="user-col">
                        <span class="user-lb user-lb1">
                            所属机构：
                        </span>
                        <!-- <tree-select :open="open" :treeData="treeData" :treeProps="treeProps" v-model="data.organizationUnitId" :multiple="false" placeholder="请选择组织" @setSelectedId="setSelectedId">
                        </tree-select> -->
                        <ztree-select class='wd300' v-model="data.organizationUnitId" :treedata="treeData" :childprops="childprops" @change='setSelectedId'></ztree-select>
                    </div>
                    <div class="user-col">
                        <span class="user-lb">
                            角　色：
                        </span>
                        <div class="util-select">
                            <el-select v-model="data.roleId" placeholder="请选择" class="wd230" size="mini" @change="console.log(val)">
                                <el-option size="mini" v-for="item in rolelist" :key="item.id" :label="item.displayName" :value="item.id">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="user-col">
                        <span class="user-lb">
                            状　态：
                        </span>
                        <div class="util-select">
                            <el-select v-model="data.isActive" placeholder="请选择" class="wd230" size="mini">
                                <el-option size="mini" v-for="item in status" :key="item.isActive" :label="item.value" :value="item.isActive">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                </div>
                <div class="user-row">
                    <div class="user-col">
                        <span class="user-lb user-lb1">
                            搜　索：
                        </span>
                        <div class="util-select">
                            <el-input class="wd300" size='mini' v-model="data.searchContent" placeholder="请输入用户名/姓名/手机号" @keyup.enter.native="userSearch"></el-input>

                        </div>
                    </div>

                    <el-button size="mini" type="primary" class="user-search" @click="userSearch" >搜索</el-button>
                    <div class="user-add">
                      <el-button size="mini" @click='toExcel()' class='user-down'><i class="iconfont icon-daochu"></i>&nbsp;导出</el-button>
  
                        <!-- <router-link :to="{ name:'userinfo'}" v-if="util.hasRule('Pages.Administration.Users.Create')"> -->
                            <el-button icon="el-icon-plus" type='primary' size="mini" @click="teamAdd()">新建人员</el-button>
                        <!-- </router-link> -->

                    </div>
                </div>
            </div>
            <div class="user-table">
                <el-table :data="tableData"  v-loading="listLoading" element-loaditext="Loading" :stripe='true'>
                    <el-table-column prop="name" label="姓名" width="120">
                    </el-table-column>
                    <el-table-column prop="phoneNumber" label="手机号" width="180 ">
                    </el-table-column>
                    <el-table-column prop="userName" label="用户名" width="180">
                    </el-table-column>
                    <el-table-column prop="organizationUnit" label="所属机构">
                      <template slot-scope="scope">
                        <el-tooltip placement="top" effect="light">
                           <div slot="content">{{scope.row.organizationUnit}}</div>
                             <span>{{scope.row.organizationUnit  | lastname}}</span>
                            </el-tooltip>
                        </template>
                    </el-table-column>
                    <el-table-column prop="role" label="角色" width="180">
                    </el-table-column>
                    <el-table-column prop="isActive" label="状态" width="90">
                        <template slot-scope="scope">
			                 <div v-if="scope.row.isActive"><i class="icon iconfont icon-icon01" style="color:#389E0D"></i>正常</div>
			                 <div v-if="!scope.row.isActive"><i class="icon iconfont icon-icon01" style="color:#CF1322"></i>禁用</div>
			            </template>
                    </el-table-column>
                    <el-table-column label="操作"   prop="id" align='right'>
                        <template slot-scope="scope">
                          <el-popover placement="bottom" width="280" trigger="click"  :ref="'fzrpsw'+scope.row.id">
                            <div class="unit-pwd">
                              <el-form :model="passwordForm" :rules="rules" :ref="'passWordF'+scope.row.id" :inline="true">
                                <el-form-item label="密　码: " prop="chargerNewPassword" style="margin-right:0;">
                                  <el-input class="wd180" size="mini" type="text" minlength="6" maxlength="18" v-model="passwordForm.chargerNewPassword"></el-input>
                                </el-form-item>
                                <el-form-item label="" style="margin-top:-12px;padding-left:55px;">
                                  <el-checkbox v-model="chargerIstrue">首次登录修改初始密码</el-checkbox>
                                </el-form-item>
                                <div style="text-align: right; margin: 0">
                                  <el-button size="mini" type="info" @click=" closePassword('fzrpsw',scope.row.id)">取消</el-button>
                                   <!-- $refs['fzrpsw'+scope.row.id].doClose() -->
                                  <el-button type="primary" size="mini" @click="changePassword('passWordF',scope.row.id,passwordForm.chargerNewPassword,chargerIstrue,'fzrpsw',scope.row.id)">确定</el-button>
                                </div>
                              </el-form>
                            </div>
                            <a class="editPwd oper-a" slot="reference">修改密码</a>
                          </el-popover>
                            <!-- <a class="oper-a">修改密码</a> -->
                        
                          <!-- <router-link v-if="util.hasRule('Pages.Administration.Users.Edit')" :to="{ name: 'userinfoedit', query: { userId: scope.row.id}}"> -->
                               <a class="oper-a" type="text" style="margin-left:10px;" @click="teamEdit(scope.row.id)">编辑</a>
                        <!-- </router-link> -->

                        </template>
                    </el-table-column>
                </el-table>
                <div class="user-page">
                    <el-pagination @current-change="handleCurrentChange" background :page-size="10" layout="total,prev, pager, next" :total="pagedata.total" :current-page.sync="currentPage">
                    </el-pagination>
                </div>

            </div>

        </div>


    <!--添加录单员账号dialog-->
    <el-dialog title="新建人员信息" :visible.sync="dialogAdd" :close-on-click-modal='false' width="700px">
      <el-form :model="addForm" label-width="105px" :inline="true" ref="addForm" :rules="addRules" >
        <el-row>
          <el-col :span="12">
            <el-form-item label="姓　　名:" class="is-required" prop="name">
              <el-input class="wd180" v-model="addForm.name" auto-complete="off" size="mini"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="状　　态:" class="is-required" prop="isActive">
              <el-radio v-model="addForm.isActive" :label="true">正常</el-radio>
              <el-radio v-model="addForm.isActive" :label="false">禁用</el-radio>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="手 机 号:" class="is-required" prop="phoneNumber">
              <el-input class="wd180" v-model="addForm.phoneNumber" auto-complete="off" size="mini" minlength="11" maxlength="11"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="电子邮箱:" prop="emailAddress">
              <el-input class="wd180" v-model="addForm.emailAddress" auto-complete="off" size="mini"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="身份证号:" prop="identityCard">
              <el-input class="wd180" v-model="addForm.identityCard" auto-complete="off" size="mini" minlength="15" maxlength="18"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="角　　色:" class="is-required"  prop="assignedRoleIds">
             <div class="util-select">
                  <el-select v-model="addForm.assignedRoleIds" placeholder="请选择" class="wd180" size="mini">
                      <el-option size="mini" v-for="item in addRolelist" :key="item.id" :label="item.displayName" :value="item.id">
                      </el-option>
                  </el-select>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="所属机构:" class="is-required" prop='belongOrganizationUnitId'>
              <ztree-select class='wd180' v-model="addForm.belongOrganizationUnitId" :treedata="treeData" :childprops="childprops" ></ztree-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="允许查看保单:" class="is-required" prop="policyPermission">
              <el-select v-model="addForm.policyPermission" placeholder="请选择" class="wd180" size="mini">
                <el-option size="mini" v-for="item in policyPermissionList" :key="item.id" :label="item.displayName" :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="账　　号:" class="is-required" prop="userName">
              <el-input class="wd180" v-model="addForm.userName" auto-complete="off" size="mini"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="密　　码:" class="is-required" prop="password">
              <el-input class="wd180" v-model="addForm.password" auto-complete="off" size="mini"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label=" " prop="check">
              <el-checkbox v-model="addForm.shouldChangePasswordOnNextLogin">首次登录修改初始密码</el-checkbox>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" class="dialog-footer toCenter">
        <el-button @click="closeDialog('addForm')" size="small">取 消</el-button>
        <el-button type="primary" @click="CreateOrUpdateUser('addForm')" :loading="teamLoading" size="small">保存</el-button>
        <!-- dialogAdd = false -->
      </div>
    </el-dialog>


    <el-dialog title="编辑人员信息" :visible.sync="dialogEdit" :close-on-click-modal='false' width="700px">
      <el-form :model="editForm" :inline="true" :rules="editRules" ref="editForm" :label-width="editLable">
        <el-row>
          <el-col :span="12">
            <el-form-item label="姓　　名:" class="is-required" prop="name">
              <el-input class="wd180" v-model="editForm.name" auto-complete="off" size="mini"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="状　　态:"  prop="isActive">
              <el-radio v-model="editForm.isActive" :label="true">正常</el-radio>
              <el-radio v-model="editForm.isActive" :label="false">禁用</el-radio>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="手 机 号:" class="is-required" prop="phoneNumber">
              <el-input class="wd180" v-model="editForm.phoneNumber" auto-complete="off" size="mini"  minlength="11" maxlength="11"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="电子邮箱:" prop="emailAddress">
              <el-input class="wd180" v-model="editForm.emailAddress" auto-complete="off" size="mini"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="身份证号:" prop="identityCard">
              <el-input class="wd180" v-model="editForm.identityCard" auto-complete="off" size="mini"  minlength="15" maxlength="18"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="角　　色:"  prop="assignedRoleIds">
            
              <div class="util-select">
                  <el-select  v-model="editForm.assignedRoleIds" placeholder="请选择" class="wd180" size="mini">
                      <el-option size="mini" v-for="item in setRoleList" :key="item.id" :label="item.displayName" :value="item.id">
                      </el-option>
                  </el-select>
          
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="所属机构:"  prop="belongOrganizationUnitId">
              <ztree-select class='wd180' v-model="editForm.belongOrganizationUnitId" :treedata="treeData" :childprops="childprops" ></ztree-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="允许查看保单:" class="is-required" prop="policyPermission">
              <el-select v-model="editForm.policyPermission" placeholder="请选择" class="wd180" size="mini">
                <el-option size="mini" v-for="item in policyPermissionList" :key="item.id" :label="item.displayName" :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" class="dialog-footer toCenter">
        <el-button @click="closeDialog('editForm')" size="small">取 消</el-button>
        <el-button type="primary" @click="saveEdit('editForm')" size="small" :loading="editLoading">保 存</el-button>
      </div>
    </el-dialog>
    </div>
</template>

<script>
import Vue from "vue";
import { getList } from "@/api/table";
import treeSelect from "@/components/tree-select/tree.vue";
import ztreeSelect from "@/components/z-select/index.vue";

export default {
  components: {
    treeSelect,
    ztreeSelect
  },
  data() {
     var chargerPwd = (rule, value, callback) => {
      //var regx = /^[a-zA-Z0-9]{6,18}$/;
      var regx = /^\S{6,18}$/; //匹配非空字符
      
      if (!regx.test(value)) {
        callback(new Error("请输入6-18位数的密码"));
      } else {
        callback();
      }
    };
    return {
      passwordForm: {
          chargerNewPassword: ''
      },
      //数组子级相关参数
      childprops: {
        name: "displayName", //显示名字
        children: "organizationUnits", //子级字段名
        lv: "level" //当前层级
      },
      pagedata: {},
      currentPage: 1,
      list: null,
      listLoading: false,
      tableData: [],
      value: null,
      teamLoading:false,
      editLoading:false,
      data: {
        roleId: "",
        isActive: "",
        organizationUnitId: "",
        searchContent: ""
      },
      organizationUnitId: [""],
      treeData: [],
      treeProps: {
        label: "displayName",
        children: "orgs",
        level: "depth",
        value: "id"
      },

      rolelist: [], //角色下拉
      setRoleList:[],//新建角色下拉
      units: [], //组织机构
      unitsprops: {
        value: "id",
        children: "organizationUnits",
        label: "displayName"
      },
      defaultProps: {
        children: "code",
        label: "displayName"
      },
      status: [
        {
          value: "全部状态",
          isActive: ""
        },
        {
          value: "正常",
          isActive: "true"
        },
        {
          value: "禁用",
          isActive: "false"
        }
      ],
      open: true,
      page: 1,
      addForm:{},//添加人员
      editForm: {}, //编辑form
      dialogAdd: false, //新建录单员
      dialogEdit: false, //编辑录单员
      addLable: "100px",
      editLable: "105px",
       policyPermissionList: [
        {
          id: 0,
          displayName: "仅查看自己的保单"
        },
        {
          id: 1,
          displayName: "查看所属机构的保单"
        },
        {
          id: 2,
          displayName: "查看所属机构和下级机构的保单"
        }
      ],//添加用户->允许查看保单
      formTeam:{},
      addRules: {
        name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
        isActive: [
          { required: true, message: "请选择状态", trigger: "change" }
        ],
        belongOrganizationUnitId: [
          { required: true, message: "请选择所属机构", trigger: "change" },
        
        ],
        phoneNumber: [
          { required: true, message: "请输入手机号", trigger: "blur" },
            {
              pattern:  /^\d{11}$/,
              message: '请输入11位数字手机号'
          }
        ],
        userName: [{ required: true, message: "请输入账号", trigger: "blur" }],
        password: [{ required: true, message: "请输入6-18位数的密码", trigger: "blur" }],
        policyPermission: [
          { required: true, message: "请选择允许查看保单", trigger: "change" }
        ],
        emailAddress:[
           { required: false, message: "请输入邮箱地址", trigger: "blur" },
            {
              pattern:  /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/,
              message: '请输入正确的邮箱地址'
          }
        ],
        identityCard:[
            { required: false, message: "请输入身份证号", trigger: "blur" },
            {
              pattern:   /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
              message: '请输入正确的身份证号'
          }
        ],
        assignedRoleIds:[{ required: true, message: "请选择角色", trigger: "change" }],
      },//添加角色验证信息
       editRules: {
        name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
        phoneNumber: [
          { required: true, message: "请输入手机号", trigger: "blur" },
           {
              pattern: /^\d{11}$/,
              message: '请输入11数字手机号'
          }
        ],
         emailAddress:[
           { required: false, message: "请输入邮箱地址", trigger: "blur" },
            {
              pattern:  /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/,
              message: '请输入正确的邮箱地址'
          }
           ],
            identityCard:[
            { required: false, message: "请输入身份证号", trigger: "blur" },
            {
              pattern:  /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
              message: '请输入正确的身份证号'
          }
        ],
        policyPermission: [
          { required: true, message: "请选择允许查看保单", trigger: "change" }
        ]
      },
       rules: {
        chargerNewPassword: [
          {
              required: true,
              message: '请输入6-18位数的密码',
              trigger: 'blur'
          }, {
              min: 6,
              max: 18,
              message: '请输入6-18位数的密码'
          }, {
              pattern:  /^\S{6,18}$/,
              message: '请输入6-18位数的密码'
          }
        ]
      },
      chargerNewPassword:"",
      chargerIstrue:true,
      addRolelist:[],//新增人员角色数据list
    };
  },
  mounted(){
    console.log("units")
    console.log(this.units)
  },
  filters: {
    lastname(val) {
      let index = val.lastIndexOf("-");
      if (index !== "-1") {
        let sli = val.substr(index + 1, val.length);
        return sli;
      }
    }
  },
  created() {
    this.loadrole();
    this.getUnits();
    console.log(11111111);
    console.log(this.$route.query);
    if (this.$route.query.page) {
      this.page = this.$route.query.page;
    }
    if (this.$route.query.org) {
      this.data.organizationUnitId = Number(this.$route.query.org);
    }
    if (this.$route.query.role) {
      this.data.roleId = Number(this.$route.query.role);
    }
    if (this.$route.query.key) {
      this.data.searchContent = this.$route.query.key;
    }
    if (this.$route.query.is) {
      Vue.set(this.data, "isActive", this.$route.query.is);
      //this.data.isActive = this.$route.query.is;
    }

    this.loadlist();
  },
  watch: {
    $route(to, from) {
      console.log(2222222);
      console.log(this.$route.query);
      this.page = this.$route.query.page;
      this.data.organizationUnitId = this.$route.query.org;
      this.data.roleId = this.$route.query.role;
      this.data.searchContent = this.$route.query.key;
      this.data.isActive = this.$route.query.is;
      this.loadlist();
    }
  },
  methods: {
    handleClick(data) {
      console.log(data);
    },
    handleCurrentChange(val) {
      this.$router.push({
        name: "userment",
        query: {
          page: val,
          org: this.data.organizationUnitId,
          role: this.data.roleId,
          key: this.data.searchContent,
          is: this.data.isActive,
          time: new Date().getTime()
        }
      });
    },
    loadlist() {
      this.listLoading = true;
      //用户列表
      const me = this;
      let params = {
        pageIndex: this.page,
        organizationUnitId: this.data.organizationUnitId,
        roleId: this.data.roleId,
        searchContent: this.data.searchContent,
        isActive: this.data.isActive
      };
      this.post(params, "services/app/user/GetUsers").then(rs => {
        if (rs.success) {
          this.tableData = rs.result.items;
          let totalCount = rs.result.totalCount;
          //分页配置
          this.pagedata.total = totalCount;
          this.listLoading = false;
          this.currentPage = this.page;
        }
      });
    },
    loadrole() {
      //角色
      const me = this;
      let all = { id: "", displayName: "全部角色" };
      let params = {};
      this.post(params, "services/app/common/GetRoles").then(rs => {
        console.log(rs);

        if (rs.success) {
         let aarr =  JSON.stringify(rs.result.items) ;
          me.addRolelist = JSON.parse(aarr)
          let result= rs.result.items;
          console.log( rs.result.items)
          result.unshift(all);
          this.rolelist = result;
          this.setRoleList = result;  
          
        }
      });
    },
    // loadUnits() {
    //   //组织机构
    //    let all = { id: "", displayName: "全部组织机构" };
    //   let params = {

    //   };
    //   this.post(params, "services/app/common/GetOrganizationUnits").then(
    //     rs => {
    //       console.log(rs);
    //       if (rs.success) {
    //         let units = rs.result;
    //          units.unshift(all);
    //         console.log(units);
    //         this.units=units
    //       }
    //     }
    //   );
    // },
    getUnits() {
      let params = [];
      this.post(params, "services/app/common/GetOrganizationUnits").then(rs => {
        console.log(rs);
        if (rs.success) {
          // let data = rs.result;
          // let arr = [];
          // arr.push(data);
          this.treeData = rs.result;
        }
      });
    },
    setSelectedId(val) {
      console.log(val);
      this.data.organizationUnitId = val;
    },
    userSearch() {
      this.$router.push({
        name: "userment",
        query: {
          page: 1,
          org: this.data.organizationUnitId,
          role: this.data.roleId,
          key: this.data.searchContent,
          is: this.data.isActive,
          time: new Date().getTime()
        }
      });
    },
    toExcel() {
      const me = this;
      let data = this.data;

      this.post(data, "services/app/user/GetUsersToExcel").then(rs => {
        if (rs.success) {
          let path = rs.result.filePath;
          console.log(path);
          window.location.href = path;
        }
      });
    },
    teamAdd() {
      this.addForm = Object.assign({}, {}, {
        isActive:true,
        shouldChangePasswordOnNextLogin:true,
        belongOrganizationUnitId:''
      });
      this.dialogAdd = true;
    },
    CreateOrUpdateUser(formName) {//添加角色接口
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.teamLoading = true;
          console.log(params)
           let user = this.addForm;
          let params = {
            user: user,
            assignedRoleIds: [user.assignedRoleIds],
            IsSalesman: false
          };
          // return
          this.post(params, "services/app/user/CreateOrUpdateUser").then(
            res => {
              console.log(res);
              if (res.success) {
                this.teamLoading = false;
                this.dialogAdd = false;
                this.loadlist()
              } else {
                this.teamLoading = false;
                this.$notify.error({
                  title: "错误",
                  message: res.error.message
                });
              }
              recorderAccount
            }
          );
        } else {
          console.log("error submit");
          return false;
        }
      });
    },
    //编辑录单员账号
    teamEdit(id) {
     
      this.post({ id: id }, "services/app/user/GetUserDetail").then(res => {
        console.log(res);
        if (res.success) {
          this.dialogEdit = true;
          this.editForm = res.result;
          console.log()
           this.editForm  = Object.assign({},res.result,{
             assignedRoleIds:res.result.roleId
           })
          //  this.editForm.assignedRoleIds = res.result.roleId
      
        }
      });
      
    },
    closeDialog(formName) {
      //关闭弹层
      this.dialogAdd = false;
      this.dialogEdit = false;
      this.$refs[formName].resetFields();
    },
    //编辑录单员保存
    saveEdit(formName) {
      
      // console.log(this.editForm.organizationUnitIds)
      this.$refs[formName].validate(valid => {
       
        this.editForm.password = ''
        this.editForm.roleId = this.editForm.assignedRoleIds
        let user = this.editForm;
        let params = {
            user: user,
            assignedRoleIds: [user.assignedRoleIds],
            IsSalesman: false
          };
        if (valid) {
           this.editLoading = true;
          this.post(
            params,
            "services/app/user/CreateOrUpdateUser"
          ).then(rs => {
            if (rs.success) {
              this.$notify({
                title: "成功",
                type: "success",
                message: "人员保存成功",
                customClass: "el-notification-success"
              });
              this.dialogEdit = false;
              this.editLoading = false;
               this.loadlist()
            } else {
              this.editLoading = false;
              this.$notify.error({
                title: "错误",
                message: res.error.message
              });
            }
          });
        } else {
          console.log("error submit");
          return false;
        }
      });
    },
    rouIdChange(val){
      console.log(val)
    },
     changePassword(password,id, newPassword, shouldChangePasswordOnNextLogin, val,sid) {
      //  console.log(newPassword)
      //     return
        this.$refs[password+id].validate(valid => {
         
          if (valid) {
            let params = {
                userId: id,
                newPassword: newPassword,
                shouldChangePasswordOnNextLogin: shouldChangePasswordOnNextLogin
              };
              this.post(params, "services/app/user/ChangePassword").then(res => {
                console.log(res.result);
                if (res.success) {
                  this.$notify({
                    title: "成功",
                    type: "success",
                    message: "修改密码成功",
                    customClass: "el-notification-success"
                  });
                  
                  if (val == 'fzrpsw'+sid) {
                     this.passwordForm.chargerNewPassword = ''
                    this.$refs[val+sid].doClose();
                  } else {
                     this.passwordForm.chargerNewPassword = ''
                    this.$refs[val+sid].doClose();
                  }
                } else {
                  this.$notify.error({
                    title: "错误",
                    message: res.error.message
                  });
                }
              });
          }else{
             console.log("error submit");
          return false;
          }
        })
    },
    closePassword(val,id){
        this.chargerIstrue = true
        this.passwordForm.chargerNewPassword = ''
        this.$refs[val+id].doClose()
    }
  }
  
};
</script>

<style lang="scss" scoped>
.wd300 {
  width: 300px;
}
.icon-icon01 {
  font-size: 14px;
  vertical-align: middle;
}
.toCenter {
  text-align: center;
}
.state-circle {
  width: 6px;
  height: 6px;
  border-radius: 3px;
  background-color: #9b9b9b;
  display: inline-block;
  line-height: 40px;
  position: relative;
  top: -2px;
  margin-right: 6px;
}
.state-active {
  background-color: #7ed321;
}
.app-box {
  border-radius: 3px;
  // border: 1px solid #ddd;
  // background: #fff;
  min-height: 575px;
  position: relative;
  .user-top {
    .user-row {
      margin-bottom: 22px;
      height: 28px;
      .user-col {
        float: left;
        position: relative;
        padding-left: 80px;
        margin-right: 20px;
        .user-lb {
          position: absolute;
          left: 0;
          top: 0;
          text-align: right;
          width: 70px;
          line-height: 28px;
          color: #606266;
        }
        .user-lb1 {
          text-align: left;
        }
      }
      .user-search {
        float: left;
        margin-left: 15px;
      }
      .user-add {
        float: right;
      }
    }
    .user-row:last-child {
      margin-bottom: 30px;
    }
  }
  .user-page {
    width: 100%;
    text-align: right;
    margin-top: 30px;
  }
  .oper-a {
    color: #027dca;
  }
}
.user-down {
  margin-right: 10px;
}
 @media screen and (max-width: 1400px) {
   .app-box .user-top .user-row  .wd230 {
          width: 175px;
        }
      }
.el-dialog__body {
    padding: 30px 20px;
    color: #606266;
    line-height: 24px;
    font-size: 14px;
}
.el-form--inline .el-form-item {
    display: inline-block;
    margin-right: 10px;
    vertical-align: top;
}
.el-form-item {
    margin-bottom: 22px;
}

</style>

